/*
 * @Description: 搜索里的list
 * @Author: YWJ 
 * @Date: 2022-04-20 17:02:28 
 * @Last Modified by: YWJ
 * @Last Modified time: 2022-05-15 23:56:15
 */


<template>
  <scroll-page
    :loading="loading"
    :no-data="noData"
    :offset="offset"
    @load="load"
  >
    <ArticleItem v-for="(item, index) in articles" :key="index" v-bind="item">
    </ArticleItem>
  </scroll-page>
</template>

<script>
import ScrollPage from "@/components/scrollpage";
import ArticleItem from "@/components/article/ArticleItem";
// 统一请求处理
import {
  getSearchArticlesTitle,
  getSearchArticlesContext,
  getSearchArticlesAuthor,
  throttle
} from "@/api/article.js";
export default {
  components: {
    "scroll-page": ScrollPage,
    ArticleItem,
  },
  props: {
    //外部传入 判断是获取点赞列表还是个人列表还是收藏列表
    select: String,
    pageKw: String,
  },
  data() {
    return {
      loading: false,
      noData: false,
      offset: 0,
      // 请求参数 页数 返回的大小
      innerPage: {
        pageNum: 1,
        limit: 3,
        account: localStorage.getItem("account"),
        kw: "",
      },
      selectfunc: "",
      articles: [],
    };
  },

  // 在此生命周期请求获得数据
  created() {},

  watch: {
    pageKw(newVal, oldVal) {
      // 监听 num 属性的数据变化
      // 作用 : 只要 num 的值发生变化,这个方法就会被调用
      // 第一个参数 : 新值
      // 第二个参数 : 旧值,之前的值
      this.articles = [];
      this.innerPage.pageNum = 1;
      this.getArticles();
      console.log("oldVal:", oldVal);
      console.log("newVal:", newVal);
      console.log("select",this.select)
    },
  },

  methods: {
    load() {
      // 如果触发分页 需要调用接口 加载文章列表
      throttle(this.getArticles, 500, true)
    },
    getArticles() {
      this.selectfunc = this.select;
      this.innerPage.kw = this.pageKw;
      if (this.selectfunc == "1") {
        this.loading = true;
        getSearchArticlesTitle(this.innerPage).then((res) => {
          var vo = res.data;
          if (vo.code == 10000) {
            if (res.data.data.list.length <= 0) {
              this.noData = true;
            }
            
            if(res.data.data.pageCount>=this.innerPage.pageNum){
            this.articles = this.articles.concat(res.data.data.list);
            }
            this.innerPage.pageNum += 1;
          } else {
            console.log("no");
          }
        });
        this.loading = false;
      }

      if (this.selectfunc == "2") {
        this.loading = true;
        getSearchArticlesContext(this.innerPage).then((res) => {
          var vo = res.data;
          if (vo.code == 10000) {
            if (res.data.data.list.length <= 0) {
              this.noData = true;
            }
          if(res.data.data.pageCount>=this.innerPage.pageNum){
            this.articles = this.articles.concat(res.data.data.list);
          }
          this.innerPage.pageNum += 1;
          } else {
            console.log("no");
          }
        });
        this.loading = false;
      }

        if (this.selectfunc == "3") {
        this.loading = true;
        getSearchArticlesAuthor(this.innerPage).then((res) => {
          var vo = res.data;
          if (vo.code == 10000) {
            if (res.data.data.list.length <= 0) {
              this.noData = true;
            }
          if(res.data.data.pageCount>=this.innerPage.pageNum){
            this.articles = this.articles.concat(res.data.data.list);
            console.log(this.articles);
          }
          this.innerPage.pageNum += 1;
          } else {
            console.log("no");
          }
        });
        this.loading = false;
      }
      
    },
  },
};
</script>

<style>
.el-card {
  border-radius: 0;
}

.el-card:not(:first-child) {
  margin-top: 10px;
}
</style>